<template>
  <a-modal
    title="$t('componentsDialogImg.tpyl')"
    :width="640"
    :visible="showDialog"
    @ok="handleCancel"
    @cancel="handleCancel"
  >
    <div v-if="img_url" style="text-align: center">
      <img class="dialog-img" :src="img_url" alt="">
    </div>
  </a-modal>
</template>

<script>
export default {
  props: [
    'is_show',
    'img_url'
  ],
  data () {
    return {
      labelCol: {
        xs: { span: 24 },
        sm: { span: 7 }
      },
      wrapperCol: {
        xs: { span: 24 },
        sm: { span: 13 }
      },
      visible: false,
      confirmLoading: false,
      showDialog: false
    }
  },
  methods: {
    handleCancel () {
      this.showDialog = false
    }
  },
  watch: {
    is_show (val) {
      this.showDialog = true
    }
  }
}
</script>

<style scoped>
  .dialog-img{
    max-width: 80%;
    max-height: 80%;
  }
</style>
